$color__inactive: #616161;
$color__primary: #3f51b5;
$color__read: #9f9f9f;
$color__checkbox__star: #616161;

$prefix: 'stbui-table';

:host {
  display: block;
  height: 100%;
}

.#{$prefix} {
  position: relative;
  min-height: 60px;
  max-height: 60px;
  padding: 8px 24px;
  white-space: nowrap;
  font-weight: 500;
  font-size: 15px;
  text-decoration: none;
  color: $color__inactive;
  transition: background 0.1s ease-in-out;
  border-bottom: 1px solid #eee;
  cursor: pointer;

  &.read {
    color: $color__read;
    font-weight: normal;
  }

  &:hover {
    background: #eee;
  }
}

.#{$prefix}-main {
  margin-top: 10px;
  max-height: 480px;
  overflow-x: hidden;
  overflow-y: auto;
}

.#{$prefix}-toolbar {
  box-sizing: border-box;
  min-height: 60px;
  max-height: 60px;
  border-bottom: 1px solid #eee;
  padding: 8px 24px;
  color: $color__inactive;
}

.start-wrapper {
  padding-right: 8px;

  .checkbox {
    margin: 0 8px 0 0;
    color: $color__checkbox__star;
  }
}

.content-wrapper {
  white-space: nowrap;
}

.end-wrapper {
  margin-left: 16px;
}

.header {
  position: relative;
  height: 200px;
  background: linear-gradient(90deg, #fc0, #ffa100);
  padding: 16px;

  > button {
    margin-right: 16px;
  }
}

.file-uploader {
  position: absolute;
  left: 30px;
  bottom: -20px;
}
